https://mp.weixin.qq.com/s/L5R-hOXf00_fKo0UJpEyew

他们都是 CSS 预处理器，是 CSS 上的一种抽象层。他们是一种特殊的语法/语言编译成 CSS。 
增加了 CSS代码的复用性，层级，mixin， 变量，循环， 函数等对编写以及开发UI组件都极为方便。


<!-- 区别 -->

1.编译环境不一样

less和sass都是css的拓展语言，最主要的区别是less是通过Javascript编译，
而Sass是在服务端处理的，以前是Ruby，现在是Dart-Sass或Node-Sass，
如果没有引入前端工程化，less会消耗客户端性能，sass会消耗服务端性能，
但是引入前端工程化的话，gunt，gulp，webpack等，less和sass在打包阶段都会转化成css，所以不会有区别，


2.变量符不一样，Less是@，而Scss是$。


3.输出格式
      Less没有输出设置，
      
      Sass编译输出的CSS格式可以自定义。有4种输出格式：
      :nested – 嵌套格式   （默认）
      :expanded – 展开格式
      :compact – 紧凑格式
      :compressed – 压缩格式

3.Sass支持条件语句，可以使用if{}else{},for{}循环等等。而Less不支持

4.混合模式的不同(Mixins)

  Less中使用混合时，只需在classB中根据classA的命名来使用；

  Sass中首先在定义混合时需要使用@mixin命令，其次在调用时需要使用@include命令来引入之前定义的混合。